<template>
  <common-info-dialog
    :visible.sync="dialogShow"
    @cancel="close"
    :title="dialogTitle"
  >
    <common-info-table>
      <common-info-table-cell label="业务系统编码" width="50%"
        >{{ detail.operationCode }}
      </common-info-table-cell>
      <common-info-table-cell label="业务系统名称" width="50%"
        >{{ detail.operationName }}
      </common-info-table-cell>

      <common-info-table-cell label="主机ID" width="50%"
        >{{ detail.hostId }}
      </common-info-table-cell>
      <common-info-table-cell label="主机名称" width="50%"
        >{{ detail.hostName }}
      </common-info-table-cell>
      <common-info-table-cell label="IP" width="50%"
        >{{ detail.ip }}
      </common-info-table-cell>
      <common-info-table-cell label="MAC地址" width="50%"
        >{{ detail.mac }}
      </common-info-table-cell>
      <common-info-table-cell label="子网掩码" width="50%"
        >{{ detail.netmask }}
      </common-info-table-cell>
      <common-info-table-cell label="端口" width="50%"
        >{{ detail.exposePort }}
      </common-info-table-cell>
      <common-info-table-cell label="组织"
        >{{ detail.deptName }}
      </common-info-table-cell>

      <common-info-table-cell label="描述"
        >{{ detail.operationContent }}
      </common-info-table-cell>
    </common-info-table>
  </common-info-dialog>
</template>

<script>
import { getSingleArray, getFullDept } from "@/utils/util";
export default {
  props: {
    deptListParams: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {
      dialogTitle: "",
      dialogShow: false,
      detail: {},
    };
  },
  computed: {},
  methods: {
    /**
     * 关闭
     */
    close() {
      this.dialogShow = false;
    },
    /**
     * 显示
     */
    show(data) {
      this.dialogTitle = "业务系统详情";
      this.detail = data.id ? data : {};

      let singleDeptList = getSingleArray(this.deptListParams);
      let dept = singleDeptList.find((item) => item.id === data.deptId);
      if (dept) {
        this.detail.deptName = getFullDept(dept.fulllabel);
      }
      this.dialogShow = true;
    },
  },
};
</script>
